.home {
  width: 100%;
  height: 100%;
  padding-top: 50px;
  min-width: 1000px;
  .header {
    width: 100%;
    min-width: 1000px;
    height: 50px;
    position: fixed;
    padding-left: 200px;
    padding-right: 200px;
    border-bottom: 1px solid #110F20;
    z-index: 999;
    top: 0;
    left: 0;
    background: #1B172F;
    .header-logo {
      display: inline-block;
      vertical-align: top;
      position: absolute;
      top: 0;
      left: 0;
      width: 200px;
      height: 50px;
      line-height: 50px;
      text-align: center;
      font-size: 26px;
      color: #FFE900;
    }
    .header-menu {
      display: inline-block;
      vertical-align: top;
      width: 100%;
      height: 50px;
      ul {
        text-align: center;
        .header-menu-item {
          display: inline-block;
          vertical-align: top;
          width: 100px;
          height: 50px;
          line-height: 50px;
          text-align: center;
          cursor: pointer;
          color: #fff;
          a{
            color: #fff;
            &:active{
              color: #FFE900;
            }
            &:focus{
              color: #FFE900;
            }
          }
        }
      }
    }
    .header-set {
      display: inline-block;
      vertical-align: top;
      width: 200px;
      height: 50px;
      position: absolute;
      right: 0;
      top: 0;
      line-height: 50px;
      text-align: center;
      .header-set-avatar {
        display: inline-block;
        vertical-align: top;
        height: 50px;
        .el-avatar{
          margin-top: 10px;
        }
      }
      .header-set-dropdown {
        display: inline-block;
        vertical-align: top;
        .el-dropdown {
          cursor: pointer;
          color: #fff;
        }
      }
    }
  }
  .el-container{
    height: 100%;
    .el-aside{
      position: relative;
      .aside{
        background: #110F20;
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        padding-top: 10px;
        ul{
          .aside-item.aside-item_active {
            background: #F2F1F6;
            span{
              color: #110F20;
            }
          }
          .aside-item{
            width: 100%;
            height: 50px;
            display: block;
            margin-top: 10px;
            &:hover{
              background: #F2F1F6;
              opacity: 0.8;
            }
            span{
              display: block;
              width: 100%;
              height: 100%;
              color:#fff;
              text-align: center;
              line-height: 50px;
              cursor: pointer;
              font-size: 25px;
              &:hover{
                color: #110F20;
              }
            }
          }
        }
        .aside-bottom{
          position: absolute;
          bottom: 0;
          left: 0;
          width: 70px;
          height: 50px;
          &:hover{
            background: #F2F1F6;
          }
          span{
            display: block;
            width: 100%;
            height: 100%;
            color:#fff;
            text-align: center;
            line-height: 50px;
            cursor: pointer;
            font-size: 25px;
            &:hover{
              color: #110F20;
            }
          }
        }
      }
    }
    .el-main{
      padding: 0;
      background: #fff;
      overflow: hidden;
      .home-main-show{
        padding-left: 200px;
        position: relative;
      }
      .home-main{
        height: 100%;
        overflow: auto;
        .home-main-asid{
          width: 200px;
          height: 100%;
          position: fixed;
          left: 70px;
          top: 50px;
          overflow: hidden;
          background: #F2F1F6;
        }
        .home-main-view{
          display: inline-block;
          vertical-align: top;
          width: 100%;
          height: 100%;
        }
      }
    }
  }
}
